<!-- 采购合同详情 -->
<template>
  <div class="registerDetail">
    <van-nav-bar :title="$route.meta.title" left-text="返回" left-arrow :fixed="true" :placeholder="true" @click-left="$router.go(-1)" :right-text="auditBtn" @click-right="showAudit" />
    <div>
      <div class="headerbox">
        <div class="header_top" v-if="billidColumns && billidColumns.length != 0">
          <div class="header_item" v-for="(item, index) in billidColumns" :key="index" @click="handleClick(index)" :class="tabIndex == index ? 'active' : ''">
            <div class="txt">{{ item.number }}</div>
            <div class="txt1">{{ item.bizDate }}</div>
          </div>
        </div>
      </div>
    </div>
    <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
      <van-swipe-item v-for="(item, index) in dataSource.imageCol" :key="index">
        <img :src="item.imageUrl" />
      </van-swipe-item>
    </van-swipe>
    <div class="carModel_title">{{ dataSource.carModel }}</div>
    <div class="buy_content">
      <div class="carInfo">
        <div class="carInfo_item">
          <span class="label_txt">采购合同编号：</span>
          {{ dataSource.billNumber }}
        </div>
        <div class="carInfo_item">
          <span class="label_txt">采购合同状态：</span>
          {{ dataSource.billStatus }}
        </div>
        <div class="carInfo_item">
          <span class="label_txt">车架号：</span>
          {{ dataSource.vinCode }}
        </div>
        <div class="carInfo_item">
          <span class="label_txt">初登日期：</span>
          {{ dataSource.firstRegDate }}
        </div>
        <div class="carInfo_item">
          <span class="label_txt">保险到期日：</span>
          {{ dataSource.insExpiryDate }}
        </div>
        <div class="carInfo_item">
          <span class="label_txt">年检有效期：</span>
          {{ dataSource.yCValidityDate }}
        </div>
        <div class="carInfo_item">
          <span class="label_txt">销售类型：</span>
          {{ dataSource.salesType }}
        </div>
        <div class="carInfo_item">
          <span class="label_txt">内饰颜色：</span>
          {{ dataSource.shInsideColor }}
        </div>
        <div class="carInfo_item">
          <span class="label_txt">外饰颜色：</span>
          {{ dataSource.shOutsideColor }}
        </div>
        <div class="carInfo_item">
          <span class="label_txt">是否新能源：</span>
          {{ dataSource.isNewENergy ? dataSource.isNewENergy.alias : "-" }}
        </div>
        <div class="carInfo_item">
          <span class="label_txt">是否客户寄售：</span>
          {{ dataSource.isCSUsedCars ? "是" : "否" }}
        </div>
      </div>
      <div class="carInfo">
        <div class="carInfo_title">签约信息</div>
        <div class="carInfo_item">
          <span class="label_txt">归属展厅：</span>
          {{ dataSource.showOrgName }}
        </div>
        <div class="carInfo_item">
          <span class="label_txt">签约公司：</span>
          {{ dataSource.signCompany }}
        </div>
        <div class="carInfo_item">
          <span class="label_txt">签约展厅：</span>
          {{ dataSource.signHall }}
        </div>
        <div class="carInfo_item">
          <span class="label_txt">签约日期：</span>
          {{ dataSource.bizDate }}
        </div>
        <div class="carInfo_item">
          <span class="label_txt">采购人员：</span>
          {{ dataSource.followPerson }}
        </div>
        <div class="carInfo_item">
          <span class="label_txt">采购金额：</span>
          {{ dataSource.amount }}
        </div>
        <div class="carInfo_item">
          <span class="label_txt">客户姓名：</span>
          {{ dataSource.customerName }}
        </div>
        <div class="carInfo_item">
          <span class="label_txt">身份证号：</span>
          {{ dataSource.idCardNo }}
        </div>
        <div class="carInfo_item">
          <span class="label_txt">联系电话：</span>
          {{ dataSource.phoneNum }}
        </div>
        <div class="carInfo_item flex">
          <div class="carInfo_item_price">
            <span class="label_txt">应付款金额：</span>
            {{ dataSource.realPayAmt }}
          </div>
          <div class="carInfo_item_price">
            <span class="label_txt">已付款金额：</span>
            {{ dataSource.amountPaid }}
          </div>
        </div>
        <div class="carInfo_item flex">
          <div class="carInfo_item_price">
            <span class="label_txt">是否付全款：</span>
            {{ dataSource.isPay ? "是" : "否" }}
          </div>
          <div class="carInfo_item_price">
            <span class="label_txt">付款日期：</span>
            {{ dataSource.payDate }}
          </div>
        </div>
        <div class="carInfo_item">
          <span class="label_txt">未开票金额：</span>
          {{ dataSource.remainingInvoiceAmount }}
        </div>
        <div class="carInfo_item flex">
          <div class="carInfo_item_price">
            <span class="label_txt">是否开全票：</span>
            {{ dataSource.isCommit ? "是" : "否" }}
          </div>
          <div class="carInfo_item_price">
            <span class="label_txt">开票日期：</span>
            {{ dataSource.invoiceDate }}
          </div>
        </div>
        <div class="carInfo_item flex">
          <div class="carInfo_item_price">
            <span class="label_txt">入库状态：</span>
            {{ dataSource.stockStatus }}
          </div>
          <div class="carInfo_item_price">
            <span class="label_txt">入库日期：</span>
            {{ dataSource.stockDate }}
          </div>
        </div>
        <div class="carInfo_item">
          <span class="label_txt">关联销售合同：</span>
          {{
          dataSource.relateSaleContractNum
          ? dataSource.relateSaleContractNum
          : "-"
          }}
        </div>
      </div>

      <div class="carInfo">
        <div class="source flex" @click="handleAssessDetail">
          <div class="source_txt">线索来源</div>
          <van-icon name="arrow" />
        </div>

        <div class="carInfo_item">车辆推荐人：{{ dataSource.carSuggess }}</div>
        <div class="carInfo_item">推荐人所属部门：{{ dataSource.leadsShowOrgName }}</div>
      </div>
    </div>
    <div class="buy_footer flex">
      <div class="buy_footer_item flex" @click="handleFile">
        <div class="buy_footer_lt">
          <div>采购附件</div>
          <div class="txt">点击查看</div>
        </div>
        <div class="buy_footer_rt">
          <van-icon name="arrow" />
        </div>
      </div>
      <div class="buy_footer_item flex" @click="handlePayOrder(dataSource.isGenPayment)">
        <div class="buy_footer_lt">
          <div>采购付款单</div>
          <div class="txt">{{ dataSource.isGenPayment ? "点击查看" : "未生成" }}</div>
        </div>
        <div class="buy_footer_rt">
          <van-icon name="arrow" />
        </div>
      </div>
      <div class="buy_footer_item flex" @click="handleCarStorge(dataSource.isGenPurIn)">
        <div class="buy_footer_lt">
          <div>车辆入库单</div>
          <div class="txt">{{ dataSource.isGenPurIn ? "点击查看" : "未生成" }}</div>
        </div>
        <div class="buy_footer_rt">
          <van-icon name="arrow" />
        </div>
      </div>
      <div class="buy_footer_item flex" @click="handleBuyOrder(dataSource.isGenInvoice)">
        <div class="buy_footer_lt">
          <div>采购发票</div>
          <div class="txt">{{ dataSource.isGenInvoice ? "点击查看" : "未生成" }}</div>
        </div>
        <div class="buy_footer_rt">
          <van-icon name="arrow" />
        </div>
      </div>
    </div>

    <!-- 转交 -->
    <van-dialog v-model="updateServiceVisible" title="请选择转交跟进人" show-cancel-button @confirm="updateServiceConfirm" :before-close="beforeCloseUpdateTel">
      <van-field v-model="updateServiceData.serverPsnName" name="跟进人" label="跟进人" input-align="right" placeholder="请选择" readonly right-icon="arrow" @click="handleUpdateSelect()" />
    </van-dialog>

    <!-- 操作面板 -->
    <van-share-sheet v-model="showShare" :options="options" @select="onSelect" />
    <div class="morebox">
      <div class="moreBtn" @click="handleShowDo">更多操作</div>
    </div>
    <!-- 审核情况 -->
    <AuditRecord :visible="auditVisible" :billId="dataSource.billId ? dataSource.billId : detailId" @close="auditVisible = false"></AuditRecord>
  </div>
</template>

<script>
import {
  Empty,
  Field,
  Form,
  ImagePreview,
  ShareSheet,
  Dialog,
  Swipe,
  SwipeItem,
  Notify
} from "vant";
import { getCookies } from "@/utils/util.js";
import icon_edit from "@/assets/images/icon_edit.png";
import icon_foll from "@/assets/images/icon_foll.png";
import icon_zj from "@/assets/images/icon_zj.png";
import ico_apply from "@/assets/images/ico_apply.png";
import icon_buy from "@/assets/images/icon_buy.png";
import white_png from "@/assets/images/white.png";
import sellManageApi from "@/api/sellManageApi";
import AuditRecord from "@/components/AuditRecord";
export default {
  name: "buyContractDetail",
  components: {
    Empty,
    Field,
    Form,
    ImagePreview,
    ShareSheet,
    Dialog,
    Swipe,
    SwipeItem,
    Notify,
    AuditRecord
  },
  data() {
    return {
      showTimerPicker: false,
      dataSource: {
        billId: "", //单据ID
        billNumber: "", //单据编号
        billStatus: "", //单据状态
        billEntryId: "", //分录ID
        carNo: "", //车牌号
        videCode: "", //车架号
        carModel: "", //二手车型
        firstRegDate: "", //初等日期
        insExpiryDate: "", //保险到期日
        yCValidityDate: "", //年检到期日
        salesType: "", //销售类型
        shOutsideColor: "", //外饰颜色
        shInsideColor: "", //外饰颜色
        isNewENergy: "", //是否新能源
        isCSUsedCars: "", //是否客户寄售
        amount: "", //采购金额
        isPay: "", //是否付款
        payDate: "", //付款日期
        isCommit: "", //是否开票
        invoiceDate: "", //开票日期
        stockStatus: "", //入库状态
        stockDate: "", //入库日期
        brandName: "", //所属品牌
        brandId: "", //所属品牌
        showOrgName: "", //所属展厅
        showOrgId: "", //所属展厅
        signCompany: "", //签约公司
        signCompanyId: "", //签约公司
        bizDate: "", //签约日期
        followPerson: "", //采购人员
        customerName: "", //客户名称
        idCardNo: "", //身份证
        phoneNum: "", //联系电话
        realPayAmt: "", //应付金额
        amountPaid: "", //已付金额
        remainingInvoiceAmount: "", //未开票金额
        carSuggess: "", //车辆推荐人
        leadsPurId: "", //采购线索id
        leadsShowOrgName: "", //推荐人展厅
        leadsFixcenterName: "", //推荐人维修中心
        followPersonId: ""
      },
      uploader: [],
      columns: [],
      billidColumns: [], // 单据列表ID
      tabIndex: 0,
      showSelectPicker: false,
      disabled: false,
      detailId: "",
      tabActive: 0,
      userId: getCookies("userId"), //用户ID，必填，String
      showShare: false,
      options: [
        [
          { name: "编辑合同", icon: icon_edit, value: 1 },
          { name: "生成采购入库", icon: icon_buy, value: 5 },
          { name: "生成采购付款", icon: icon_zj, value: 3 }
        ],
        [
          { name: "生成采购发票", icon: ico_apply, value: 4 },
          { name: "作废合同", icon: icon_foll, value: 2 },
          { name: "关联销售合同", icon: icon_buy, value: 6 }
        ]
      ],
      updateServiceVisible: false,
      updateServiceData: {
        fixCenterId: "",
        fixCenterName: "",
        currentServerPsnName: "",
        serverPsnName: "",
        serverPsnId: "",
        id: "",
        userId: ""
      },
      auditBtn: "",
      auditVisible: false,
      auditFlag: false,
      userInfo: JSON.parse(getCookies("userInfo"))
    };
  },

  mounted() {
    if (this.$route.query) {
      this.detailId = this.$route.query.billId;
      this.getDetail(this.detailId);
    }
    if (this.$route.query && this.$route.query.list) {
      this.billidColumns = this.$route.query.list;
    }
  },
  methods: {
    handleClick(index) {
      this.tabIndex = index;
      let billId = this.billidColumns[index].billId;
      this.detailId = billId;
      this.getDetail(this.detailId);
    },
    getDetail(billId) {
      sellManageApi
        .secondHandCarFacade({
          billId,
          method: "getPurchaseContractById"
        })
        .then(res => {
          if (res.code == 1) {
            this.dataSource = res.data;
            if (
              this.dataSource.followPersonId == this.userInfo.kdpersonid ||
              this.dataSource.followPersonId == this.userId
            ) {
              this.auditFlag = true;
            } else {
              this.auditFlag = false;
            }
            if (
              this.dataSource.billStatus != "保存" ||
              this.dataSource.billStatus == "作废"
            ) {
              this.auditBtn = "审批情况";
            }
          }
        });
    },

    // 选择下拉
    handleSelect(field) {
      if (this.disabled) {
        return;
      }
      this.showSelectPicker = true;
      if (field == "repair") {
        this.columns = [
          { name: "是", value: 1 },
          { name: "否", value: 2 }
        ];
      } else if (field == "outUser") {
        this.columns = [
          { name: "服务人员1", value: 1 },
          { name: "服务人员2", value: 2 }
        ];
      }
      this.field = field;
    },
    // 选择下拉确认
    handleSelectConfirm(value, index) {
      this.dataSource[this.field] = value.name;
      this.showSelectPicker = false;
    },

    onConfirm(val, field) {
      let year = val.getFullYear();
      let month = val.getMonth() + 1;
      let day = val.getDate();
      let hour = val.getHours();
      let minute = val.getMinutes();
      // let second = val.getSeconds()
      if (month >= 1 && month <= 9) {
        month = `0${month}`;
      }
      if (day >= 1 && day <= 9) {
        day = `0${day}`;
      }
      if (hour >= 0 && hour <= 9) {
        hour = `0${hour}`;
      }
      if (minute >= 0 && minute <= 9) {
        minute = `0${minute}`;
      }
      // if (second >= 0 && second <= 9) { second = `0${second}` }
      this.dataSource[field] = `${year}-${month}-${day} ${hour}:${minute}:00`;
      this.showTimerPicker = false;
    },

    formatter(type, value) {
      if (type === "year") {
        return `${value}年`;
      } else if (type === "month") {
        return `${value}月`;
      } else if (type === "day") {
        return `${value}日`;
      } else if (type === "hour") {
        return `${value}时`;
      } else if (type === "minute") {
        return `${value}分`;
      } else if (type === "second") {
        return `${value}秒`;
      }
      return value;
    },
    //维修预约
    applyRepair() {
      this.$router.push("/applyRepair");
    },
    // 获取list名称
    getFieldName(list, key, val) {
      if (list && list.length > 0) {
        let obj = list.filter(item => {
          return item[key] == val;
        });
        if (obj.length > 0) {
          return obj[0].name;
        }
      }
      return null;
    },

    handleShowDo() {
      this.showShare = true;
    },
    onSelect(option) {
      if (
        option.value == 1 ||
        option.value == 2 ||
        option.value == 3 ||
        option.value == 4 ||
        option.value == 5 ||
        option.value == 6
      ) {
        if (!this.auditFlag) {
          Notify({
            type: "danger",
            message: "您不是该合同的采购人员无法进行此操作"
          });
          return;
        }
      }
      let vm = this;
      if (option.value == 1) {
        if (this.dataSource.billStatus != "保存") {
          Notify({ type: "danger", message: "当前单据状态不可编辑" });
          return;
        }
        this.$router.push({
          path: "/buyContractEdit",
          query: { billId: this.dataSource.billId }
        });
      }
      if (option.value == 2) {
        Dialog.confirm({
          title: "提示",
          message: `您将对采购合同【${this.dataSource.billNumber}】进行作废？`
        })
          .then(() => {
            // on confirm
            sellManageApi
              .secondHandCarFacade({
                method: "invalidPurchaseContract", //固定值
                billId: this.detailId //单据Id，必填，String
              })
              .then(res => {
                if (res.code == 1) {
                  Notify({ type: "success", message: "作废成功" });
                  this.$router.go(-1);
                }
              });
          })
          .catch(() => {
            console.log("取消");
            // on cancel
          });
      }
      if (option.value == 3) {
        if (vm.dataSource.billStatus != "审核") {
          Notify({ type: "danger", message: "当前单据状态不可生成付款单" });
          return;
        }
        if (!vm.dataSource.isGenPurIn) {
          Notify({
            type: "danger",
            message: "车辆入库单未生成，无法生成付款单！"
          });
          return;
        }
        if (
          (vm.dataSource.realPayAmt == vm.dataSource.amountPaid &&
            vm.dataSource.realPayAmt != 0) ||
          vm.dataSource.isPay == 1
        ) {
          Notify({
            type: "danger",
            message: "车辆已完成付款，付款单无法再次生成！"
          });
          return;
        }
        if (vm.dataSource.billStatus == "审核" && vm.dataSource.isGenPurIn) {
          Dialog.confirm({
            title: "提示",
            message: `您将对采购合同【${this.dataSource.billNumber}】生成采购付款单？`
          })
            .then(() => {
              sellManageApi
                .secondHandCarFacade({
                  method: "purContractToPurPaymentByBOTP", //固定值
                  purContractId: this.detailId //单据Id，必填，String
                })
                .then(res => {
                  console.log(res);
                  if (res.code == 1) {
                    this.getDetail(this.detailId);
                    Notify({ type: "success", message: "生成采购付款成功" });
                  }
                });
            })
            .catch(() => {
              console.log("取消");
              // on cancel
            });
        } else {
          Notify({
            type: "danger",
            message: "当前状态无法生成付款单"
          });
          return;
        }
      }
      if (option.value == 4) {
        if (vm.dataSource.billStatus != "审核") {
          Notify({ type: "danger", message: "当前单据状态不可生成采购发票" });
          return;
        }
        if (
          vm.dataSource.remainingInvoiceAmount <= 0 ||
          vm.dataSource.remainingInvoiceAmount == null
        ) {
          Notify({
            type: "danger",
            message: "当前未开票金额不可生成采购发票"
          });
          return;
        }

        if (!vm.dataSource.isGenPurIn) {
          Notify({
            type: "danger",
            message: "车辆入库单未生成，无法生成采购发票！"
          });
          return;
        }
        Dialog.confirm({
          title: "提示",
          message: `您将对采购合同【${this.dataSource.billNumber}】生成采购发票？`
        })
          .then(() => {
            sellManageApi
              .secondHandCarFacade({
                method: "purContractToPurInvoiceByBOTP", //固定值
                purContractId: this.detailId //单据Id，必填，String
              })
              .then(res => {
                if (res.code == 1) {
                  this.getDetail(this.detailId);
                  Notify({ type: "success", message: "生成采购发票成功" });
                }
              });
          })
          .catch(() => {
            console.log("取消");
            // on cancel
          });
      }
      if (option.value == 5) {
        if (vm.dataSource.billStatus != "审核") {
          Notify({ type: "danger", message: "当前单据状态不可生成入库单" });
          return;
        }
        Dialog.confirm({
          title: "提示",
          message: `您将对采购合同【${this.dataSource.billNumber}】生成采购入库？`
        })
          .then(() => {
            sellManageApi
              .secondHandCarFacade({
                method: "purContractToPurInWareByBOTP", //固定值
                purContractId: this.detailId //单据Id，必填，String
              })
              .then(res => {
                if (res.code == 1) {
                  this.getDetail(this.detailId);
                  Notify({ type: "success", message: "生成采购入库成功" });
                }
              });
          })
          .catch(() => {
            console.log("取消");
            // on cancel
          });
      }
      if (option.value == 6) {
        if (vm.dataSource.isExisSaleContractSubmit) {
          Notify({ type: "danger", message: "关联申请正在审批中，勿重复提交" });
          return;
        }
        if (vm.dataSource.billStatus == "审核") {
          this.$router.push({
            path: "relateContract",
            query: { billId: vm.dataSource.billId }
          });
        } else {
          Notify({
            type: "danger",
            message: "当前状态不能进行关联销售合同操作"
          });
          return;
        }
      }

      this.showShare = false;
    },
    // 确认转交
    updateServiceConfirm() {
      console.log(this.updateServiceData);
      if (!this.updateServiceData.serverPsnId) {
        Notify({ type: "danger", message: "请选择跟进人" });
        return;
      }
      carApi
        .updateServerPsnAndFixCenter({
          id: this.updateServiceData.id, //单车表id，String，必填
          fixCenterId: this.updateServiceData.fixCenterId, //送修人电话，String，必填
          serverPsnId: this.updateServiceData.serverPsnId,
          userId: this.requestParams.userId //用户ID，必填，String
        })
        .then(res => {
          if (res.code == 1) {
            Notify({ type: "success", message: "更新成功" });
            this.initData();
          } else {
            Notify({ type: "danger", message: res.errorMessage });
          }
        });

      this.updateServiceVisible = false;
    },
    beforeCloseUpdateTel(action, done) {
      if (action === "confirm") {
        return done(false);
      } else {
        return done();
      }
    },
    handleUpdateSelect() {},
    handleAssessDetail() {
      if (!this.dataSource.leadsPurId) {
        Notify({ type: "danger", message: "无线索单据" });
        return;
      }
      this.$router.push({
        path: "/assessManageDetail",
        query: { leadsPurId: this.dataSource.leadsPurId }
      });
    },

    handleFile() {
      this.$router.push({
        path: "/fileMange",
        query: { billId: this.detailId }
      });
    },
    // 查看付款单
    handlePayOrder(status) {
      if (!status) {
        return;
      }
      this.$router.push({
        path: "/PaymentOrder",
        query: {
          orderId: this.detailId,
          billNumber: this.dataSource.billNumber
        }
      });
    },
    // 查看入库
    handleCarStorge(status) {
      if (!status) {
        return;
      }
      this.$router.push({
        path: "/CarStorge",
        query: {
          orderId: this.detailId,
          billNumber: this.dataSource.billNumber
        }
      });
    },
    // 开票
    handleBuyOrder(status) {
      if (!status) {
        return;
      }
      this.$router.push({
        path: "/PurchaseInvoice",
        query: {
          orderId: this.detailId,
          billNumber: this.dataSource.billNumber
        }
      });
    },
    showAudit() {
      this.auditVisible = true;
    }
  }
};
</script>

<style lang="less" scoped>
body {
  background: #f3f3f3;
}
.flex {
  display: flex;
  align-items: center;
}
.van-swipe-item {
  width: 100%;

  img {
    width: 100%;
    display: block;
  }
}
.headerbox {
  width: 100%;
  overflow-x: auto;
  &::-webkit-scrollbar {
    display: none;
  }
}
.header_top {
  display: flex;
  align-self: center;
  padding: 10px;
  overflow-x: auto;
  // width: 12rem;
  .header_item {
    // width: 3rem;
    background: #fff;
    padding: 10px 15px;
    font-size: 16px;
    border-radius: 5px;
    margin-right: 10px;
    .txt {
      margin-bottom: 5px;
    }
    &.active {
      border: 1px solid #ccc;
      box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    }
  }
}
.registerDetail {
  padding-bottom: 75px;
  .top_detail {
    display: flex;
    align-items: center;
    // width: 100%;
    background: #fff;
    padding: 10px;
    margin: 10px;
    .top_detail_lt {
      display: inline-block;
      text-align: center;
      width: 50%;
      border-right: 1px solid #f0f0f0;
    }
    .top_detail_rt {
      width: 50%;
      display: inline-block;
      text-align: center;
    }
    .top_name {
      font-weight: bold;
      font-size: 16px;
      margin-bottom: 5px;
    }
    .top_status {
      color: red;
      font-size: 16px;
      margin-bottom: 5px;
    }
    .top_txt {
      font-size: 16px;
      color: #333;
      margin-bottom: 5px;
      .icon-tel {
        background: #35bc04;
        color: #fff;
        border-radius: 50%;
        padding: 5px;
      }
    }
  }
}
.buy_content {
  .buy_name {
    background: #fff;
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 15px;
    padding-top: 5px;
  }
  .carInfo {
    padding: 10px;
    background: #fff;
    margin-bottom: 10px;
    .source {
      padding-left: 0 !important;
      margin-bottom: 10px;
      justify-content: space-between;

      .source_txt {
        font-size: 16px;
      }
    }

    .carInfo_No {
      margin-bottom: 15px;
      .carInfo_No_item {
        border-right: 1px solid #ccc;
        padding-right: 5px;
        margin-right: 5px;
        font-size: 16px;
        color: #333;
        &:last-child {
          border: none;
        }
      }
    }
    .carInfo_item {
      font-size: 16px;
      margin-bottom: 5px;
      color: #333;
      display: flex;
      .carInfo_item_price {
        width: 50%;
        display: flex;
      }
      .label_txt {
        color: #666;
        display: block;
      }
    }
    .carInfo_title {
      font-size: 16px;
      color: #333;
      margin-bottom: 10px;
      font-weight: bold;
    }
  }
}
.buy_footer {
  background: #fff;
  flex-wrap: wrap;
  box-sizing: border-box;
  width: 100%;
  .buy_footer_item {
    box-sizing: border-box;
    width: 50%;
    padding: 15px;
    justify-content: space-between;
    border-bottom: 1px solid #f5f5f5;
    border-right: 1px solid #f5f5f5;
    .buy_footer_lt {
      font-size: 16px;
      color: #333;
      padding-left: 15px;
      .txt {
        color: #bbbbbb;
        margin-top: 10px;
        font-size: 14px;
      }
    }
    .buy_footer_rt {
    }
  }
}

.morebox {
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 99;
  width: 100%;
  background: #fff;
  .moreBtn {
    background: #409eff;
    color: #fff;
    width: 75%;
    margin: auto;
    text-align: center;
    padding: 12px;
    border-radius: 5px;
    margin-top: 15px;
    font-size: 16px;
    margin-bottom: 25px;
  }
}
.carModel_title {
  background: #fff;
  padding: 15px10px 010px;
  font-size: 16px;
  color: #333;
  line-height: 18px;
  font-weight: bold;
}
/deep/ .van-share-sheet__icon {
  width: 40px;
  height: 40px;
}
/deep/ .van-share-sheet__name {
  width: 80px;
  text-align: center;
}
</style>
